<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.selected{
				background: orange;
				color: white;
			}
		</style>
		<script src="../课件/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				$('button').click(function(_event){
					var $target = $(_event.target);
					if($target.is('button:first')){
						if($('input').eq(1).prop('checked',true)){
							$('tr').eq(1).removeClass();
							$('input').eq(1).attr('checked','');
						}else{
//							$('tr').eq(1).addClass('selected');
//							$('input').eq(1).attr('checked','checked');
//                          $(':checkbox', $('tr:last').addClass('selected')).prop('checked', true);

                            $('tr:eq(1)').addClass('selected').find(':checkbox').prop('checked',true)
						}
							
						
					}else if($target.is('button:eq(1)')){
						
						$('tr:last').addClass('selected');
						$('input:last').last().attr('checked','checked');
						
					}else if($target.is('button:eq(2)')){
						
						$('tr:eq(1)').addClass('selected');
						$('input:eq(1)').last().attr('checked','checked');
						$('tr:eq(2)').addClass('selected');
						$('input:eq(2)').last().attr('checked','checked');
						$('tr:eq(3)').addClass('selected');
						$('input:eq(3)').last().attr('checked','checked');
						
					}else if($target.is('button:eq(3)')){
						
						$('tr:eq(9)').addClass('selected');
						$('input:eq(9)').last().attr('checked','checked');
						$('tr:last').addClass('selected');
						$('input:last').last().attr('checked','checked');
						
					}else if($target.is('button:eq(4)')){
						
						$('tr:eq(5)').addClass('selected');
						$('input:eq(5)').last().attr('checked','checked');
						
					}
				})
			})
		</script>
	</head>
	<body>
		<button>选择第一行</button>
		<button>选择最后行</button>
		<button>选择前三行</button>
		<button>选择后两行</button>
		<button>选择第五行</button><br />
		<br />
		<table border="1px gray solid" cellspacing="0" cellpadding="0">
			<tr><th><input type="checkbox" /></th><th>姓名</th><th>年龄</th><th>性别</th><th>婚姻状况</th><th>工作状况</th></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
			<tr><td><input type="checkbox" /></td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td><td>单元格</td></tr>
		</table>
	</body>
</html>
